/* 
    Document   : style
    Created on : 7 avr. 2012, 11:32:02
    Author     : julien
    Description:
        Purpose of the stylesheet follows.
*/




/**************************************/
/* Style global de la page (structure)*/
/**************************************/

body{
    width: 800px;
    margin-left: auto;
    margin-right: auto;
}


footer{
    text-align: center;
}

#notification{
    color: red;
    font-weight: bold;
}

/* Style de la flèche retour en haut de page */
#arrow{
    position: fixed;
    left: 0px;
    bottom: 0px;
}

h1{
    display: none;
}

h1,h2,h3{
    color: #fd7427;
}

p,ul{
    color: #506367;
}

/**************************************/
/* Style des formulaires et menues    */
/**************************************/
.form{
    color: white;
    font-weight: bold;
    background-color: #fd7427;
    padding: 50px;
    border-radius: 20px;
    margin-top: 20px;
}

.form li a{
    color: white;
}

/**************************************/
/* Style du jeu                       */
/**************************************/
#game{
    display: none;
    overflow: auto;
    height: 300px;
    width: 800px;
    overflow: hidden;
    background-image: url("img/ring.png");
    background-repeat: no-repeat;
    background-position: center;
    z-index: 100;
}

#game_result{
    display: none;
    font-weight: bold;
    color: white;
    background-color: #fd7427;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}

#game img{
    height: 100px;
    width: 100px;
    display: block;
}


#player_score{
    position: absolute;
}


#computer_score{
    position: absolute;
}

#player_bloc img, #computer_bloc img{
    background-color: #e4ae74;
}


#rock{
    position:relative;
    left:0px;
}

#paper{
    position: relative;
    left:0px;
}

#scissors{
    position: relative;
    left:0px;
}

#rock_computer{
    position: relative;
    right: 0px;
}

#paper_computer{
    position: relative;
    right: 0px;
}

#scissors_computer{
    position: relative;
    right: 0px;
}


#player_bloc{
    float: left;
}

#computer_bloc{
    float: right;
}

.left_column, .right_column{
    color: white;
    font-weight: bold;
    background-color: #e4ae74;
}

.left_column{
    text-align: left;
}

.right_column{
    text-align: right;
}

/************************************/
/* Style du tableau de résultats    */
/************************************/
#results{
    width: 800px;
    display: none;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 60px;
    text-align: center;
}

#tresults{
    width: 800px;
    max-height: 200px;
    min-height: 200px;
    overflow: scroll;

}

#results caption{
    height: 40px;
    font-weight: bold;
    color: white;
    text-align: center;
    background-color: #fd7427;
    padding-top: 10px;
    padding-bottom: 10px;
}


#results td{
    width: 400px;
    height: 40px;
}

td{
    height:40px;
}

/************************************/
/* Style du tableau du score        */
/************************************/
#score{
    display: none;
    position: relative;
    text-align: center;
    width: 20%;
    margin-left: 40%;
    margin-right: 40%;
}
.small_img{
    height: 30px;
    width: 30px;
}

.win{
    background-color: #8FC26C;
}
.draw{
    background-color: #77726d;
}
.lose{
    background-color: #EE5757;
}


/*********************************************/
/* Style du bouton de réinitialisation du jeu*/
/*********************************************/
.new_game{
    padding: 10px;
    border-radius: 10px;
    background-color: white;
    color: #fd7427;
    font-weight: bold;
    margin-left: 30px;
}

.new_game:hover{
    color: white;
    background-color: #e4ae74;
    cursor: pointer;
}

#arrow{
    display: none;
}


/******************************************/
/* Style du menu de défilement des slides */
/******************************************/
.coda-slider-wrapper{
    display: none;
}

#coda-nav-1 li a{
    font-size: 110%;
    color: white;
    font-weight: bold;
    text-decoration: none;
    margin: 5px;
    padding: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #e4ae74;
}

#coda-nav-1 li a:hover{
    background-color: #c45d19;
}
